<template>
	<view class="content">
		<view class="" v-if="Object.keys(datalist).length > 0">
			
		
		<view class="wid90 mar foSi50 coFFF">欢迎加入乐优康</view>
		<view class="wid90 mar20 borRad20 bacFFF">
			
			<view class="wid100">
				<view class="wid90 mar dis disAl hei80">
					<view style="width: 40%;"><span style="color: #FF0000;">* </span>机构名称：</view>
					<input style="width: 60%;" disabled :value="datalist.name"/>
				</view>
				<view class="xhx"></view>
				<view class="wid90 mar dis disAl hei80">
					<view style="width: 40%;"><span style="color: #FF0000;">* </span>姓名：</view>
					<input style="width: 60%;" v-model="datalist.user"/>
				</view>
				<view class="xhx"></view>
				<view class="wid90 mar dis disAl hei80">
					<view style="width: 40%;"><span style="color: #FF0000;">* </span>手机号码：</view>
					<input style="width: 60%;" v-model="datalist.user_phone" />
				</view>
				
			
				<view class="xhx"></view>
				<view class="wid90 mar dis disAl hei80">
					<view style="width: 40%;"><span style="color: #FF0000;">* </span>机构地址：</view>
					<picker mode="region" style="width: 60%;" @change="districtChange" :value="date">
						<view v-if="province">{{province+'-'+city+'-'+area}}</view>
						<view v-if="!province" class="wid100" style="height: 80rpx;"></view>
					</picker>
				</view>
				<view class="xhx"></view>
				<view class="wid90 mar dis disAl hei80">
					<view style="width: 40%;"><span style="color: #FF0000;">* </span>详细地址：</view>
					<input style="width: 60%;" v-model="datalist.address" />
				</view>
				
			</view>
			<view style="height: 20rpx;"></view>
			<view class="wid80 mar hei80 borRad20 dis disAl disJuC foSi40 mar-top30 coFFF" 
				style="background-color: #1262DB;" @click="addEdit">提交</view>
			<view class="foSi25 textCen mar-top30" @click="callPhone">
				<view style="font-weight: 600;">商务热线</view>
				<view class="mar-top20" style="color: #797878;">{{tel}}</view>
			</view>
			<view class="foSi25 textCen mar-top30" @click="tiaozhuan('/pages/common/richtext?data='+agreement)">
				<view style="font-weight: 600;">相关合同</view>
				<view class="mar-top20" style="color: #797878;">《乐优康签订协议》</view>
			</view>
			<view style="height: 20rpx;"></view>
		</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				url: this.global.url,
				province: '',
				city: '',
				area: '',
				date:'',
				tel:'',
				agreement:'',
				datalist:{}
			}
		},
		onLoad() {
			// this.getuserinfo()
			this.gteAgreement()
			this.getdata()
		},
		methods: {
			getdata(){
				var that = this
				uni.request({
				    url: that.global.url + 'api/device/clinic_details',
				    method: "POST",
				    data: {
						id:uni.getStorageSync('clinic_id')
					},
				    success(res) {
				        let result = res.data
						console.log(result)
				        if(result.code == 1){
							that.datalist = result.data
							that.province = result.data.province_text
							that.city = result.data.city_text
							that.area = result.data.area_text

						}else{
							uni.showToast({
								title: result.msg,
								icon: 'error'
							})
				        }
				    }
				})
			},
			tiaozhuan(url){
				uni.navigateTo({
					url: url
				});
			},
			// 拨打电话
			callPhone() {
				var that = this
				const res = uni.getSystemInfoSync();
				// ios系统默认有个模态框
				if (res.platform == 'ios') {
					uni.makePhoneCall({
						phoneNumber: that.tel,
						success() {
							console.log('拨打成功了');
						},
						fail() {
							console.log('拨打失败了');
						}
					})
				} else {
					//安卓手机手动设置一个showActionSheet
					uni.showActionSheet({
						itemList: [that.tel],
						success: function(res) {
							console.log(res);
							uni.makePhoneCall({
								phoneNumber: that.tel,
							})
						}
					})
				}
			},
			gteAgreement(){
				var that = this
				uni.request({
				    url: that.global.url + 'api/index/agreement',
				    method: "POST",
					header: {
						'token': uni.getStorageSync('token')
					},
				    data: {},
				    success(res) {
				        let result = res.data
				        if(result.code == 1){
							that.tel = result.data.tel
							that.agreement = result.data.agreement
						}else{
							uni.showToast({
								title: result.msg,
								icon: 'error'
							})
				        }
				    }
				})
			},
			
			addEdit(){
				var that = this
				var group_id = ''
				if(!that.datalist.user){
					uni.showToast({
						title: '请输入法人姓名',
						icon: 'error'
					})
					return
				}
				let reg = /^[1][2,3,4,5,7,8,9][0-9]{9}$/      //正则表达式定义手机号正确格式
				if (!reg.test(that.datalist.user_phone)) {        //判断手机号格式时候正确
					uni.showToast({
						title: '请输入正确的手机号',
						icon: 'none'
					})
					return
				}
				console.log(that.province)
				if(!that.province){
					uni.showToast({
						title: '请选择区域',
						icon: 'error'
					})
					return
				}
				if(!that.datalist.address){
					uni.showToast({
						title: '请输入地址',
						icon: 'error'
					})
					return
				}
				let param = {
					id:uni.getStorageSync('clinic_id'),
					user:that.datalist.user,
					user_phone:that.datalist.user_phone,
					address:that.datalist.address,
					province:that.province,
					city:that.city,
					area:that.area,
				}
				console.log(param)
				// return false;
				uni.request({
				    url: that.global.url + 'api/device/save_clinic_info',
				    method: "POST",
					header: {
						
					},
				    data: param,
				    success(res) {
				        let result = res.data
				        if(result.code == 1){
							uni.showToast({
								title: result.msg,
								icon: 'success'
							})
							setTimeout(()=>{
								uni.navigateBack()
							},1000)
							
						}else{
							uni.showToast({
								title: result.msg,
								icon: 'error'
							})
				        }
				    }
				})
			},
		
			districtChange(e){
				this.province = e.detail.value[0];
				this.city = e.detail.value[1];
				this.area = e.detail.value[2];
			},
			
		}
	}
</script>

<style>
	.content {
		min-height: 100vh;
		background-color: #1262DB;
	}

</style>
